/**
 * @author jstone
 */

var LeagueView = new KONtx.Class({
 	ClassName: 'LeagueView',
	
	Extends: KONtx.system.SidebarView,

  config: {
    visibleRows: 8,
  },
	
	createView: function() {
		// put your code here for creating the elements on the page
		this.controls.backButton  = new KONtx.control.BackButton({ label: 'Back to Main Menu' }).appendTo(this);
    this.controls.topContainer = new KONtx.control.EmptySpace({
      styles: {
        height: this.height - this.controls.backButton.height,
        vOffset: this.controls.backButton.height,
      }
    }).appendTo(this);
    
    this.controls.listGrid = new KONtx.control.Grid({
      columns: 1,
      rows: this.config.visibleRows,
      carousel: true,
			cellCreator: this._cellCreator,
			cellUpdater: this._cellUpdater,
      styles: {
        width: this.controls.topContainer.width,
        height: this.controls.topContainer.height,
      },
    }).appendTo(this.controls.topContainer);

	},

	_cellCreator: function() {
		var cell = new KONtx.control.GridCell({
			styles: {
				height: KONtx.utility.scale(25),
				width: this.width,
			},
			events: {
				onSelect: function(event) {
					log("You selected Button with original 'i' # of: " + this.originalButtonNumber);
          var dialog = new KONtx.dialogs.YahooLogin({
            callback: function(logged_in) {
              if (logged_in)
                print("logged in");
                //self._importSymbols.call(self);
            }
          });
          dialog.show();
			  }
      }
		});

    cell.rank = new KONtx.element.Text({
      label: '1',
      truncation: 'end',
      styles: {
        fontSize: '22px',
        fontWeight: 'bold',
        color: 'red',
        width: 20,
        vOffset: 14,
        hOffset: 10,
      }
    }).appendTo(cell);

		cell.teamName = new KONtx.element.Text({
			label: 'Joe Flacco',
			wrap: true,
			truncation: 'end',
			styles: {
			    fontSize: '18px',
          fontWeight: 'bold',
			    color: '#FFFFFF',
			    textAlign: 'center',
          vOffset: 16,
          hOffset: cell.rank.width + 10,
			    width: this.width - cell.rank.width - 80,
			}
		}).appendTo(cell);
    
    cell.record = new KONtx.element.Text({
			label: '3-1-0',
			truncation: 'end',
			styles: {
			    fontSize: '12px',
          fontWeight: 'bold',
			    color: '#FFFF66',
			    textAlign: 'right',
          vOffset: 12,
          hOffset: cell.rank.width + cell.teamName.width + 20,
			    width: this.width - cell.rank.width - cell.teamName.width - 30,
			}
		}).appendTo(cell);
    
    cell.pts = new KONtx.element.Text({
			label: '1238 pts',
			truncation: 'end',
			styles: {
			    fontSize: '12px',
          fontWeight: 'bold',
			    color: '#99CCFF',
			    textAlign: 'right',
          vOffset: 12 + cell.record.height + 3,
          hOffset: cell.rank.width + cell.teamName.width + 20,
			    width: this.width - cell.rank.width - cell.teamName.width - 30,
			}
		}).appendTo(cell);



    return cell;
	},
	
	_cellUpdater: function(cell, dataitem) {
	    cell.rank.setText(dataitem.rank);
	    cell.teamName.setText(dataitem.teamName);
	    cell.record.setText(dataitem.record);
	    cell.pts.setText(dataitem.pts);
	},
	
  updateView: function() {
    var myUrl = new URL;
    myUrl.location = "http://" + host + "/league.php";
    var result = JSON.parse(myUrl.fetch());
    var arr = [];

    for (var i = 0; i < result.league.length; i++) {
      print(result.league[i].teamName);
      arr.push({
        rank: i + 1,
        teamName: result.league[i].teamName,
        record: result.league[i].record,
        pts: result.league[i].pts + " pts"
      });
    }
    /*
    for (var i = 0; i < 12; i++) {
      arr.push({
        label: 'Button ' + (i + 1),
        buttonNumber: i,
      });
    }
    */
    this.controls.listGrid.changeDataset(arr);
  }

});
